<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="renderer" content="webkit" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="../css/style.css" />
  <script src="../js/jquery.min.js"></script>
  <script src="../js/font.js"></script>
  <script src="../js/particles.min.js"></script>
  <title>登录</title>
</head>
<body>
  <div id="particles-js" style="position:absolute; top: 0; z-index: -1; width: 100%;height: 100%;">
    <canvas class="particles-js-canvas-el" width="1303" height="960" style="width: 100%; height: 100%;"></canvas>
  </div>
  <script>
    particlesJS("particles-js", {
      particles: {
        number: {
          value: 20,
          density: {
            enable: !0,
            value_area: 1000
          }
        },
        color: {
          value: "#e1e1e1"
        },
        shape: {
          type: "circle",
          stroke: {
            width: 0,
            color: "#000000"
          },
          polygon: {
            nb_sides: 5
          },
          image: {
            src: "img/github.svg",
            width: 100,
            height: 100
          }
        },
        opacity: {
          value: 0.5,
          random: !1,
          anim: {
            enable: !1,
            speed: 1,
            opacity_min: 0.1,
            sync: !1
          }
        },
        size: {
          value: 15,
          random: !0,
          anim: {
            enable: !1,
            speed: 180,
            size_min: 0.1,
            sync: !1
          }
        },
        line_linked: {
          enable: !0,
          distance: 650,
          color: "#cfcfcf",
          opacity: 0.26,
          width: 1
        },
        move: {
          enable: !0,
          speed: 2,
          direction: "none",
          random: !0,
          straight: !1,
          out_mode: "out",
          bounce: !1,
          attract: {
            enable: !1,
            rotateX: 600,
            rotateY: 1200
          }
        }
      },
      interactivity: {
        detect_on: "canvas",
        events: {
          onhover: {
            enable: !1,
            mode: "repulse"
          },
          onclick: {
            enable: !1,
            mode: "push"
          },
          resize: !0
        },
        modes: {
          grab: {
            distance: 400,
            line_linked: {
              opacity: 1
            }
          },
          bubble: {
            distance: 400,
            size: 40,
            duration: 2,
            opacity: 8,
            speed: 3
          },
          repulse: {
            distance: 200,
            duration: 0.4
          },
          push: {
            particles_nb: 4
          },
          remove: {
            particles_nb: 2
          }
        }
      },
      retina_detect: !0
    });
  </script>
  <div id="wrap">
    <div>
      <div id="logo">
        <div class="type-js headline">
          <br><br>
          <h1>动态IP跳转管理登录</h1>
        </div>
        <div id="kg-btn" class="">
          <input class='tgl tgl-flip' id='qieh' type='checkbox' />
        </div>
      </div>
    </div>
    <div id="main">
      <!-- 外网访问地址 -->
      <div id="app" class="app animated fadeInLeft">
        <div class="login">
            <form action="index.php" method="post">
              <input name="username" type="text" id="username"   placeholder="用户名" required="required" /></br></br>
              <input name="password" type="password" id="password"   placeholder="密码" required="required" /></br></br>              
              <button type="submit" class="btn btn-primary btn-block btn-large">登   录</button>
            </form>
        <div style="text-align:center;">
        </br><p>© 2025  版权所有.</p>
    </div>
    <div style="clear: both;"></div>
  </div>
  </div>
  <div id="footer">
    <div class="footer-contents">
      <div class="links">
      </div>
    </div>
  </div>
</body>
<script>
  $("#username").focus()
</script>

</html>